.o_lightheme {
    position: fixed;
    bottom: -100%;
    left: 25px;
    background: #fff;
    /*width:350px;*/
	width:395px;
	box-shadow: rgba(31, 33, 41, 0.2) -1px 2px 6px;
	z-index:99999999999;
	transition: all 1.7s ease-in-out 0s;
	opacity:0;
	border-radius: 5px;
	padding-bottom: 5px;
}
.o_lightheme.o_active
{
	 bottom: 20px;
	 opacity:1;
	 transition: all 1.7s ease-in-out 0s;
}

.o_contain {
    padding: 10px 10px;
    width: 100%;
    position: relative;
}
.o_contain h5 {
    font-size: 12px !important;
    line-height: 13px;
    margin: 0;
    padding: 0;
    color: #55586c;
    font-weight: normal;
	padding-bottom: 0px !important;
	padding-top: 0px !important;
	text-transform: inherit;
	padding-right: 10px !important;
}
.o_contain em {
    clear: both;
    display: block;
	margin-top: 5px;
	font-size: 11px!important;
	 color: #55586c;
	margin-bottom: 10px;
	text-align:right;
}

.o_leftimg {
    width: 25%;
    float: left;
	padding-right: 5px;
	margin-bottom: 5px;
}
.o_rightpanel {
    float: left;
    width: 70%;
	margin-left:5px;
}
.o_leftimg img {
    /*max-width: 100%;
    width: 100%;
	max-height: 100px;*/
	/*width: 100%;*/
	width: 70px;
    height: 100%;
    max-width: 100%;
    /*max-height: 100%;
    object-fit: contain;*/
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    border-radius: 3px !important;
}

.o_prname{
	margin-top: 5px;
    display: inline-block;
    padding: 0;
    font-size: 11px!important;
	 line-height: 12.5px;
	font-weight: 600;
	color: #000;
	/*font-family: inherit;*/
}

.o_rightpanel .aod_cross {
background:url(../images/aod_cros.png);
background-size: 100% 100%;
width: 11px;
height: 11px;
position: absolute;
top: 5px;
right: 5px;
padding: 0;
margin: 0;
background-color: transparent;
z-index: 999999;
cursor: pointer;
outline:none;
}



#aod_sticky_cart.aod_left {
	position: fixed;
    bottom: 45%;
    left: 15px;
    right: initial;
	z-index: 99999;
}

#aod_sticky_cart.aod_right {
    position: fixed;
    bottom: 45%;
    right: 15px;
    z-index: 99999;
	left: initial;
}



#aod_sticky_cart span {
    display: block;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: rgba(255, 255, 255, 0.9);
    -webkit-box-shadow: 1px 1px 5px #808080;
    -moz-box-shadow: 1px 1px 5px #808080;
    box-shadow: 1px 1px 5px #707080;
    padding: 10px;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    line-height: 30px !important;
    text-align: center;
    position: relative;
    box-sizing: content-box !important;
    z-index: 9999999;
    font-style: normal !important;
    font-weight: normal !important;
	color: black;
}

#aod_sticky_cart .aod_counter {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 2px solid transparent;
    width: 20px;
    height: 20px;
    background-color: #fff;
    position: absolute;
    top: -5px;
    left: -10px;
    font-size: 10px !important;
    line-height: 20px;
    font-weight: 400;
    color: #FFF;
    font-weight: 700;
    box-sizing: content-box !important;
	box-shadow: -1px 0px 3px #707080;
	padding:0 !important;
}

#aod_sticky_cart .aod_cartcircle.white::before {

    content: ""!important;
    background: url('https://demandforapps.com/recorder/images/aod_icon_white.svg') !important;
	width:23px;
	height:23px;
	background-size: 100% 100% !important;
    font-style: normal !important;
    font-weight: normal !important;
	display: inline-block !important;
    position: relative;
    top: 3px;

}

#aod_sticky_cart .aod_cartcircle.black::before {

    content: ""!important;
    background: url('https://demandforapps.com/recorder/images/aod_icon_black.svg') !important;
	width:23px;
	height:23px;
	background-size: 100% 100% !important;
    font-style: normal !important;
    font-weight: normal !important;
	display: inline-block !important;
    position: relative;
    top: 3px;

}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
}

@keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }
}

.shake {
	-webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: shake;
  animation-name: shake;
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}
.a_visibility
{
	display:none !important;
}

@media (max-width: 767px) {
.o_lightheme {
    width:300px;
}
}

/*** new template css ***/
.template_rounded {
    border-radius: 60px;
	height: 115px;
	width: 300px;
}
.template_rounded .o_contain {
    float: left;
	padding: 9px 10px;
}
.template_rounded .o_leftimg {
    border-radius: 100%;
    overflow: hidden;
    position: relative;
    height: 80px;
	width: 27%;
}
.template_rounded .o_leftimg img {
    position: absolute;
	    object-fit: unset;
		width:100%
}
.template_rounded .o_rightpanel {
    float: left;
    width: 70%;
    padding-left: 15px;
}
.template_rounded .o_rightpanel .aod_cross {
    width: 15px;
    height: 15px;
    top: 5px;
    right: -15px;
}

.template_christmas {
    background: url('https://demandforapps.com/recorder/images/christmas_banner.jpg') !important;
        background-repeat: repeat;
        background-size: auto;
    background-repeat: no-repeat !important;
    background-size: cover !important;
	padding-bottom: 0;
}
.template_christmas::before {
    content: '';
    position: absolute;
    top: -38px;
    z-index: 1;
    right: 20px;
    background: url('https://demandforapps.com/recorder/images/christmas_top.png') 0 0 no-repeat;
        background-size: auto;
    background-size: 100%;
    width: 70px;
    height: 55%;
}



.template_valentine_one.o_lightheme::before  {
	content: '';
    position: absolute;
    top: -9px;
    background: url('https://demandforapps.com/recorder/images/red-heart.png') !important;
    background-repeat: repeat-x !important;
	background-size: 18px 18px !important;
	padding-bottom: 0;
	width: 100%;
	height: 100%;
	
}

.template_valentine_one.o_lightheme::after  {
	content: '';
    position: absolute;
    top: 0px;
    background: url('https://demandforapps.com/recorder/images/red-heart.png') !important;
    background-repeat: repeat-y !important;
	background-size: 18px 18px !important;
	padding-bottom: 0;
	width: 100%;
	height: 100%;
	left:0;
	
}

.template_valentine_one.o_lightheme {
    background-image: url('https://demandforapps.com/recorder/images/cupid2.png') !important;
    background-repeat: no-repeat !important;
    background-size: 80px!important;
	background-position: bottom right!important;
	padding-bottom: 0;
}
.template_valentine_one.o_lightheme .o_leftimg {
height: 120px;
}

.template_valentine_one.o_lightheme .o_leftimg img {
padding:5px;
border-radius: 12px !important;
margin-left: 4px;
}
.template_valentine_one.o_lightheme .o_rightpanel .aod_cross
{
	top:11px;
}

.template_valentine_two.o_lightheme {
    background-image: url('https://demandforapps.com/recorder/images/valentine-theme-2.jpg') !important;
    background-repeat: no-repeat !important;
background-size: auto !important;
padding-bottom: 0;
background-position: center !important;
}

.template_valentine_two.o_lightheme::before {
    content: '';
    position: absolute;
    top: -45px;
    z-index: 1;
    right: 20px;
    background: url('https://demandforapps.com/recorder/images/cupid2.png') 0 0 no-repeat;
	background-repeat: no-repeat !important;
    background-size: 100%;
    width: 70px;
    height: 55%;
	transform: rotate(315deg);
}
/*.template_valentine_two.o_lightheme .o_leftimg {
height: 120px;
}*/

.addtocartform {
    width: 100%;
    padding: 0;
    margin: 0px 0px 0;
    border: 0;
    float: right;
    text-align: left;
}

.aod_sale_addToCart {
    margin: 0 !important;
    padding: 4px 5px !important;
    font-size: 10px !important;
    border: none !important;
	background: #101a22;
	color:#fff;
	opacity:1!important;
}


.template_rounded .o_prname {
  /*white-space: nowrap; 
  width: 155px; 
  overflow: hidden;
  text-overflow: "..."; */
}

.template_rounded .o_contain em {
    padding-right: 35px;
}



.topleft .o_lightheme {
    top: -100%;
	bottom:auto;
}
.topleft .o_lightheme.o_active
{
	 top: 30px;
	 opacity:1;
	 transition: all 1.7s ease-in-out 0s;
}


.topright .o_lightheme {
    top: -100%;
	bottom:auto;
	left:auto;
    right: 25px;
}
.topright .o_lightheme.o_active
{
	 top: 30px;
	 opacity:1;
	 transition: all 1.7s ease-in-out 0s;
}

.bottomright .o_lightheme {
    bottom: -100%;
	left:auto;
    right: 25px;
}
.bottomright .o_lightheme.o_active
{
	 bottom: 30px;
	 opacity:1;
	 transition: all 1.7s ease-in-out 0s;
}


